const { createCanvas, loadImage,Canvas } = require('canvas')
var fs = require('fs');
var path = require('path');
const canvas = createCanvas(100, 100)
const ctx = canvas.getContext('2d')
ctx.fillStyle='red';
ctx.fillRect(0,0,3,100)
ctx.fillRect(0,0,100,3)
ctx.fillRect(97,0,3,100)
ctx.fillRect(0,97,100,3)

ctx.fillStyle='rgba(0,0,0,0)';
ctx.fillRect(3,3,94,94)
canvas.createPNGStream().pipe(fs.createWriteStream(path.join(__dirname, 'z100.png'))) 

// var pieArgument = {
//     canvasWidth: 210,
//     canvasHeight: 128,
//     sum: 3456,
//     item: 1234,
//     fillColor: "rgba(0,0,0,0.5)",
//     bgColor: '#e6e6e6',
//     fontColor: '#3ebbc1'
//   };
//   // 饼图 方法定义
//   function pie (pieArgument) {
//     var percent = pieArgument.item/pieArgument.sum;
//     var pieLable = (percent * 100).toString().substring(0,5);
//     if ((percent * 100).toString().substring(5, 6) >= 5) {
//       var aa = (Number(pieLable.substring(4,5)) + 1).toString();
//       var bb = pieLable.split('');
//       bb.splice(4,1,aa);
//       pieLable = bb.join('') + '%';
//     } else {
//       pieLable = pieLable * 100 + '%';
//     }
//     var radian = Math.PI/180*360*percent - Math.PI*0.5;
//     var canvas = new Canvas(pieArgument.canvasWidth, pieArgument.canvasHeight);
//     var ctx = canvas.getContext('2d');
//     ctx.beginPath();
//     ctx.translate(pieArgument.canvasHeight/2,pieArgument.canvasHeight/2);//定义中心点
//     ctx.moveTo(0,0);
//     ctx.arc(0,0,pieArgument.canvasHeight/2,Math.PI*1.5,radian,true);
//     ctx.fillStyle=pieArgument.fillColor;
//     ctx.fill();
  
//     ctx.closePath();
//     console.log(canvas.toDataURL());//生成图片base64
//     canvas.createPNGStream().pipe(fs.createWriteStream(path.join(__dirname, 'pie.png'))) // 生成本地图片(指定文件名)
//   }
//   pie(pieArgument);


// ctx.background="rgba(0, 0, 0, 1)";
// ctx.strokeStyle = 'rgba(0,0,0,0.5)'
// ctx.beginPath();
// ctx.fillStyle='#3ebbc1';
// ctx.fill();
// ctx.closePath();
// console.log(canvas.toDataURL());
// canvas.createPNGStream().pipe(fs.createWriteStream(path.join(__dirname, 'pie.png'))) 
/*
// Write "Awesome!"
 ctx.font = '30px Impact'
ctx.rotate(0.1)
ctx.fillText('Awesome!', 50, 100)

// Draw line under text
var text = ctx.measureText('Awesome!')
ctx.strokeStyle = 'rgba(0,0,0,0.5)'
ctx.beginPath()
ctx.lineTo(50, 102)
ctx.lineTo(50 + text.width, 102)
ctx.stroke()

// Draw cat with lime helmet
loadImage('banner12.png').then((image) => {
  ctx.drawImage(image, 50, 0, 70, 70)
  console.log('<img src="' + canvas.toDataURL() + '" />')
}) */

// ctx.drawImage(image, 50, 0, 70, 70)
// console.log('<img src="' + canvas.toDataURL() + '" />')

// loadImage('banner12.png').then((image) => {
//     ctx.drawImage(image, 50, 0, 70, 70)
//     console.log('<img src="' + canvas.toDataURL() + '" />')
//   }) 